import { PageContainer } from '@ant-design/pro-layout';
import { useState, useEffect } from 'react';
import styles from './index.less';
import authConfig from '@/config/auth';
import { connect } from 'umi';
import { ConnectState } from '@/models/connect';
import { AnchorDom, SelectList, ShortList, TreatiseList } from './components';

const PaperDetail: React.FC<any> = ({ history, dispatch, question }) => {
  const [query] = useState(history.location.query);

  useEffect(() => {
    dispatch({
      type: 'question/getInfo',
      payload: query,
    });
  }, []);

  return (
    <PageContainer {...authConfig.PageContainer} content="试卷标题" className={styles.main}>
      <div className={styles.AnchorDom}>
        <AnchorDom data={{ id: '', showInkInFixed: true, affix: true }}></AnchorDom>
      </div>
      <SelectList list={question.select_list} />
      <ShortList list={question.short_list}></ShortList>
      <TreatiseList list={question.treatise_list}></TreatiseList>
    </PageContainer>
  );
};

export default connect(({ question }: ConnectState) => ({
  question,
}))(PaperDetail);
